import Qt 4.7

Rectangle {
    id: mainwin
    width: 1
    height: 1
    color: "green"

    signal cardSelect(string objectName)

    property int money
    property int bet

    Row {
        id: moneyrow
        spacing: 80
        anchors.top: parent.top
        anchors.topMargin: 20
        anchors.horizontalCenter: parent.horizontalCenter

        Text {
            id: moneylabel
            anchors.top: parent.top
            anchors.topMargin: 15
            color: "yellow"
            font.pointSize: 20
            font.bold: true
            text: "Money: " + mainwin.money
        }

        Text {
            id: betlabel
            anchors.top: parent.top
            anchors.topMargin: 15
            color: "yellow"
            font.pointSize: 20
            font.bold: true
            text: "Bet: " + mainwin.bet
        }

        Button {
            id: betplus
            objectName: "betplus"
            anchors.top: parent.top
            text: "+"
        }

        Button {
            id: betminus
            objectName: "betminus"
            anchors.top: parent.top
            text: "-"
        }
    }

    Row {
        id: cards
        objectName: "cards"
        spacing: 15
        anchors.top: moneyrow.bottom
        anchors.topMargin: 20
        anchors.horizontalCenter: parent.horizontalCenter

        Flipable {
            property alias card: card1.source
            property bool disableFlip: true
            property bool flipped: true
            property int angle: 0

            id: f1
            objectName: "card1"
            state: ""
            width: 140
            height: 224

            // Front side of the card
            front: Image {
                id: card1
                anchors.fill: f1
                smooth: true
                fillMode: Image.PreserveAspectFit

                MouseArea {
                    anchors.fill: parent

                    onReleased: {
                        f1.flipped = !f1.flipped
                    }
                }
            }
            // Back side of the card
            back: Image {
                id: back1
                anchors.fill: f1
                smooth: true
                source: "qrc:/images/back.png"
                fillMode: Image.PreserveAspectFit

                MouseArea {
                    anchors.fill: parent

                    onReleased: {
                        if (!f1.disableFlip)
                            f1.flipped = !f1.flipped
                    }
                }
            }

            transform: Rotation {
                origin.x: f1.width/2; origin.y: f1.height/2
                axis.x: 0; axis.y: 1; axis.z: 0     // rotate around y-axis
                angle: f1.angle
            }

            states: State {
                name: "back"
                PropertyChanges { target: f1; angle: 180 }
                when: f1.flipped
            }

            transitions: Transition {
                NumberAnimation { properties: "angle"; duration: 300}
            }

        }

        Flipable {
            property alias card: card2.source
            property bool disableFlip: true
            property bool flipped: true
            property int angle: 0

            id: f2
            objectName: "card2"
            state: ""
            width: 140
            height: 224

            // Front side of the card
            front: Image {
                id: card2
                anchors.fill: f2
                smooth: true
                fillMode: Image.PreserveAspectFit

                MouseArea {
                    anchors.fill: parent

                    onReleased: {
                        f2.flipped = !f2.flipped
                    }
                }
            }
            // Back side of the card
            back: Image {
                id: back2
                anchors.fill: f2
                smooth: true
                source: "qrc:/images/back.png"
                fillMode: Image.PreserveAspectFit

                MouseArea {
                    anchors.fill: parent

                    onReleased: {
                        if (!f2.disableFlip)
                            f2.flipped = !f2.flipped
                    }
                }
            }

            transform: Rotation {
                origin.x: f2.width/2; origin.y: f2.height/2
                axis.x: 0; axis.y: 1; axis.z: 0     // rotate around y-axis
                angle: f2.angle
            }

            states: State {
                name: "back"
                PropertyChanges { target: f2; angle: 180 }
                when: f2.flipped
            }

            transitions: Transition {
                NumberAnimation { properties: "angle"; duration: 300}
            }

        }

        Flipable {
            property alias card: card3.source
            property bool disableFlip: true
            property bool flipped: true
            property int angle: 0

            id: f3
            objectName: "card3"
            state: ""
            width: 140
            height: 224

            // Front side of the card
            front: Image {
                id: card3
                anchors.fill: f3
                smooth: true
                fillMode: Image.PreserveAspectFit

                MouseArea {
                    anchors.fill: parent

                    onReleased: {
                        f3.flipped = !f3.flipped
                    }
                }
            }
            // Back side of the card
            back: Image {
                id: back3
                anchors.fill: f3
                smooth: true
                source: "qrc:/images/back.png"
                fillMode: Image.PreserveAspectFit

                MouseArea {
                    anchors.fill: parent

                    onReleased: {
                        if (!f3.disableFlip)
                            f3.flipped = !f3.flipped
                    }
                }
            }

            transform: Rotation {
                origin.x: f3.width/2; origin.y: f3.height/2
                axis.x: 0; axis.y: 1; axis.z: 0     // rotate around y-axis
                angle: f3.angle
            }

            states: State {
                name: "back"
                PropertyChanges { target: f3; angle: 180 }
                when: f3.flipped
            }

            transitions: Transition {
                NumberAnimation { properties: "angle"; duration: 300}
            }

        }

        Flipable {
            property alias card: card4.source
            property bool disableFlip: true
            property bool flipped: true
            property int angle: 0

            id: f4
            objectName: "card4"
            state: ""
            width: 140
            height: 224

            // Front side of the card
            front: Image {
                id: card4
                anchors.fill: f4
                smooth: true
                fillMode: Image.PreserveAspectFit

                MouseArea {
                    anchors.fill: parent

                    onReleased: {
                        f4.flipped = !f4.flipped
                    }
                }
            }
            // Back side of the card
            back: Image {
                id: back4
                anchors.fill: f4
                smooth: true
                source: "qrc:/images/back.png"
                fillMode: Image.PreserveAspectFit

                MouseArea {
                    anchors.fill: parent

                    onReleased: {
                        if (!f4.disableFlip)
                            f4.flipped = !f4.flipped
                    }
                }
            }

            transform: Rotation {
                origin.x: f4.width/2; origin.y: f4.height/2
                axis.x: 0; axis.y: 1; axis.z: 0     // rotate around y-axis
                angle: f4.angle
            }

            states: State {
                name: "back"
                PropertyChanges { target: f4; angle: 180 }
                when: f4.flipped
            }

            transitions: Transition {
                NumberAnimation { properties: "angle"; duration: 300}
            }

        }

        Flipable {
            property alias card: card5.source
            property bool disableFlip: true
            property bool flipped: true
            property int angle: 0

            id: f5
            objectName: "card5"
            state: ""
            width: 140
            height: 224

            // Front side of the card
            front: Image {
                id: card5
                anchors.fill: f5
                smooth: true
                fillMode: Image.PreserveAspectFit

                MouseArea {
                    anchors.fill: parent

                    onReleased: {
                        f5.flipped = !f5.flipped
                    }
                }
            }
            // Back side of the card
            back: Image {
                id: back5
                anchors.fill: f5
                smooth: true
                source: "qrc:/images/back.png"
                fillMode: Image.PreserveAspectFit

                MouseArea {
                    anchors.fill: parent

                    onReleased: {
                        if (!f5.disableFlip)
                            f5.flipped = !f5.flipped
                    }
                }
            }

            transform: Rotation {
                origin.x: f5.width/2; origin.y: f5.height/2
                axis.x: 0; axis.y: 1; axis.z: 0     // rotate around y-axis
                angle: f5.angle
            }

            states: State {
                name: "back"
                PropertyChanges { target: f5; angle: 180 }
                when: f5.flipped
            }

            transitions: Transition {
                NumberAnimation { properties: "angle"; duration: 300}
            }

        }
    }

    Row {
        id: dealrow
        objectName: "dealrow"
        spacing: 110
        anchors.bottomMargin: 15
        anchors.bottom: parent.bottom
        anchors.horizontalCenter: parent.horizontalCenter

        Button {
            id: dealbutton
            objectName: "dealbutton"
            anchors.bottom: parent.bottom
            text: "Deal"
        }

        Text {
            id: message
            objectName: "message"
            anchors.bottom: parent.bottom
            anchors.bottomMargin: 15
            width: 224
            color: "yellow"
            font.pointSize: 20
            font.bold: true

        }

        Button {
            id: quitbutton
            objectName: "quitbutton"
            anchors.bottom: parent.bottom
            text: "Quit"
        }
    }

}
